import React from 'react'
import { Link } from "react-router-dom"
import "./IndexGoods.css"
function Goods(props) {
    let { goods, changeFilter } = props
    return (
        <div >
            <div>首页商品</div>
            <button onClick={() => changeFilter(0)}>商品1</button>
            <button onClick={() => changeFilter(1)}>尚品2</button>
            <button onClick={() => changeFilter(2)}>商品3</button>
            <button onClick={() => changeFilter(3)}>商品4</button>
            
            <div className="clear home_goods">
                {goods.map((item) => (
                    <Link className="box" to="/detail" key={item.id} >
                        {/* <div>id:{item.id}</div> */}
                        <img src={item.img} alt="" />
                        <div>{item.goodsname}</div>
                        <div>price:{item.price}</div>
                        {/* <div>market_price:{item.market_price}</div> */}
                    </Link>

                ))}
            </div>

        </div>
    )
}
export default React.memo(Goods);